<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>嘉信城市广场红包H5游戏</title>
    <meta name="description" content="万元红包任你抢，智能游戏乐无穷" />
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
    <link rel="stylesheet" href="/public/style/globe.css">
    <link rel="stylesheet" href="/public/shopred/style/style.css">
</head>
<body>
<img src="http://nowechat.oss-cn-shenzhen.aliyuncs.com/wechat/shopred/img/hongbaoicon.jpg" style="display: none">
<div id="loading" class="flex flex-align-center">
    <div class="flex-1">
        <div class="loadEffect">
            <span></span>
            <span></span>
            <span></span>
            <span></span>
            <span></span>
            <span></span>
            <span></span>
            <span></span>
        </div>
    </div>
</div>
<a class="ruleBtn" href="/app/shopred/rule/<%= shopredId %>?wid=<%= wechat.id %>">游戏<br>规则</a>
<div id="index" class="flex flex-align-end ">
    <div class="flex-1">
        <div class="index-top">
            <img src="/public/shopred/index_topone.png">
            <!--<div class="userinfo text-center">-->
                <!--<span class="avator"><img src="<%= user.headimgurl %>"></span>-->
                <!--<span class="name"><%= user.nickname %></span>-->
            <!--</div>-->
            <!--<div class="share text-center">-->
                <!--<button onclick="shareFri();">推荐给朋友</button>-->
            <!--</div>-->
        </div>
        <div class="index-bottom text-center">
            <div class="index-bottom-wap">
                <% redList.forEach(function(item){%>
                <div class="index-bottom-item text-left" >
                    <span class="icon"><img src="/public/shopred/red_icon.png"></span>
                    <span class="name"><%= item.name %></span>
                    <a class="over undis">你不在嘉信广场哦。</a>
                    <% if(item.allCheck) { %>
                        <a class="over indis">领完了</a>
                        <!--<a class="over indis">今天游戏已结束，请明天再来玩哦。</a>-->
                    <% }else{ %>
                        <a class="indis" href="/app/shopred/detail/<%= shopredId %>?wid=<%= wechat.id %>&redId=<%= item.id %>">寻红包</a>
                        <!--<a class="over indis">今天游戏已结束，请明天再来玩哦。</a>-->
                    <% } %>
                </div>
                <% }) %>
            </div>
        </div>
    </div>
</div>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script>
    (function () {
        var designWidth = 640, rem2px = 100;
        document.documentElement.style.fontSize = ((window.innerWidth / designWidth) * rem2px) + 'px';

        var meta = document.getElementsByTagName('meta');
        var share_desc = '';
        for(i in meta){
            if(typeof meta[i].name!="undefined"&&meta[i].name.toLowerCase()=="description"){
                share_desc = meta[i].content;
            }
        }
        var apilist='<%= jssdk.jsApiList %>';
        apilist=apilist.split(',');
        wx.config({
            debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
            appId: '<%= jssdk.appId %>',
            timestamp: '<%= jssdk.timestamp %>',
            nonceStr: '<%= jssdk.nonceStr %>',
            signature: '<%= jssdk.signature %>',
            jsApiList: apilist
        });
        wx.ready(function(){
            // 获取“分享到朋友圈”按钮点击状态及自定义分享内容接口
            wx.onMenuShareTimeline({
                title: document.title, // 分享标题
                link:window.location.href,
                imgUrl:'http://nowechat.oss-cn-shenzhen.aliyuncs.com/wechat/shopred/img/hongbaoicon.jpg' // 分享图标
            });
            // 获取“分享给朋友”按钮点击状态及自定义分享内容接口
            wx.onMenuShareAppMessage({
                title: document.title, // 分享标题
                desc: share_desc, // 分享描述
                link:window.location.href,
                imgUrl: "http://nowechat.oss-cn-shenzhen.aliyuncs.com/wechat/shopred/img/hongbaoicon.jpg", // 分享图标
                type: 'link' // 分享类型,music、video或link，不填默认为link
            });

        });
    }());
    function getLocation() {
        wx.getLocation({
            type: 'wgs84', // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入'gcj02'
            success: function (res) {
                var latitude = res.latitude; // 纬度，浮点数，范围为90 ~ -90
                var longitude = res.longitude; // 经度，浮点数，范围为180 ~ -180。
                var speed = res.speed; // 速度，以米/每秒计
                var accuracy = res.accuracy; // 位置精度
                $.ajax({
                    url: 'http://api.map.baidu.com/geocoder/v2/?ak=qbgHdk4cGMgfeAKlFawniqZ6&callback=renderReverse&location=' + latitude + ',' + longitude + '&output=json&pois=1',
                    type: "get",
                    dataType: "jsonp",
                    jsonp: "callback",
                    success: function (data) {
                        console.log('定位的百度经纬度：');
                        console.log(data);
                        var lat1=parseFloat('<%= activity.latitude %>');
                        var lng1=parseFloat('<%= activity.longitude %>');
                        var lat2=data.result.location.lat;
                        var lng2=data.result.location.lng;
                        var R = 6371.004;
                        var dis =  Math.acos(Math.sin(lat1)*Math.sin(lat2)+Math.cos(lat1)*Math.cos(lat2)*Math.cos(lng2-lng1))*R;
                        console.log(dis);
                        $.ajax({
                            url: 'http://api.map.baidu.com/telematics/v3/distance?waypoints='+lng1+','+lat1+';'+lng2+','+lat2+'&ak=qbgHdk4cGMgfeAKlFawniqZ6&output=json',
                            type: "get",
                            dataType: "jsonp",
                            jsonp: "callback",
                            success: function (response) {
                                console.log(response);
                                console.log(response.results[0]<parseInt('<%= activity.distance %>'));
                                if(response.results[0]<parseInt('<%= activity.distance %>')){
                                    $('.undis').css('display','none');
                                    $('.indis').css('display','inline-block');
                                }
                                $('#loading').fadeOut();
                            }
                        });
                    }
                });
            }
        });
    }
    wx.ready(function(){
//        alert('请通过获取地理位置才可以玩游戏哦。！');
        getLocation();
    });



</script>
</body>
</html>